<template>
	<div class="wrapper" ref="wrapper">
		<div class="content">
			<slot></slot>
		</div>
	</div>
</template>

<script>
	import Bscroll from '@better-scroll/core';
	import Pullup from '@better-scroll/pull-up';
	import MouseWheel from '@better-scroll/mouse-wheel'
	export default {
		name: 'BetterScroll',
		methods: {
			_initScroll() {
				this.$nextTick(() => {
					Bscroll.use(Pullup);
					Bscroll.use(MouseWheel)
					this.scroll = new Bscroll(this.$refs.wrapper, {
							scrollY: true,
							scrollbar: true,
							click: true,
							probeType: 3,
							pullUpLoad: true,
							mouseWheel: true
							
						}),
						this.scroll.on('scroll', (position) => {
							// console.log(position.x, position.y)
						}),
						this.scroll.on('pullingUp', () => {
							console.log('上拉加载更多');
							this.scroll.finishPullUp();

						})
				})
			},
		},
		mounted() {
			setTimeout(() => {
				this._initScroll();
			}, 20)
		},

		data() {
			return {
				scroll: null
			}
		},

	}
</script>

<style scoped>
	.wrapper {
		/* height: 100vh; */
	}
</style>
